<!--回复的工具按钮: 快速回复，只看，查询用户发言，分享，更多操作-->
<script lang="ts" setup>
import type {ReplyInfo} from "../../network/types/Reply.ts";
import {copyText, replyUrl, todo, topicCode, topicUrl} from "../../utils/Utils.ts";
import {PostRouteName, ReplyListRoute, TopicListRoute} from "../../router";
import {useRouter} from "vue-router";
import ElTagDropdown, {type Command, type MenuItem} from "../common/ElTagDropdown.vue";
import {ChatSquare, MoreFilled, Share, UserFilled} from "@element-plus/icons-vue";
import type {TopicInfo} from "../../network/types/Topic.ts";
import {useTopicReadStore} from "../../store/TopicReadStore.ts";
import {useNoticeStore} from "../../store/NoticeStore.ts";
import {ElMessage, ElMessageBox} from "element-plus";
import {ReplyStatus} from "../../network/types/ReplyStatus.ts";

interface Props {
  reply: ReplyInfo,
  topic: TopicInfo,
  username?: string | undefined,
  anonymous?: string | undefined,
}

const props = defineProps<Props>()
const router = useRouter()
const emit = defineEmits(['quickPost', 'addFavor', 'source', 'useItem'])
const topicReadStore = useTopicReadStore();
const noticeStore = useNoticeStore();

const quickPostMenu = (item: ReplyInfo): MenuItem[] => {
  return [
    {label: '回复', command: {type: '回复', params: {action: 'reply', tid: item.topicId, pid: item.replyId}}},
    {label: '引用', command: {type: '引用', params: {action: 'quote', tid: item.topicId, pid: item.replyId}}},
    {label: '评论', command: {type: '评论', params: {action: 'reply', tid: item.topicId, pid: item.replyId, comment: 1}}},
  ]
}

const userMenu = (item: ReplyInfo): MenuItem[] => {
  const userId = item.authorUid
  const fid = props.topic.forumId

  const a1: MenuItem[] = [
    {label: '只看(匿名)', command: {type: '只看(匿名)', params: {tid: item.topicId, pid: item.replyId}}}
  ]

  const a2 = [
    {label: '只看', command: {type: '只看', params: {tid: item.topicId, userId}}},
    {label: '用户主题', command: {type: '用户主题', params: {name: TopicListRoute.USER_TOPIC, params: {userId}}}},
    {label: '用户回复', command: {type: '用户回复', params: {name: TopicListRoute.USER_REPLIES, params: {userId}}}},
    {label: '本版主题', command: {type: '本版主题', params: {name: TopicListRoute.USER_TOPIC, params: {userId, fid}}}},
    {label: '本版精华', command: {type: '本版精华', params: {name: TopicListRoute.USER_TOPIC, params: {userId, fid, recommend: 1}}}},
    {label: '本版回复', command: {type: '本版回复', params: {name: TopicListRoute.USER_REPLIES, params: {userId, fid}}}},
  ]

  return item.anonymous ? a1 : a2
}

const shareMenu = (item: ReplyInfo): MenuItem[] => {
  const url = item.replyId ? replyUrl(item.replyId) : topicUrl(item.topicId)
  const code = item.replyId ? `[pid=${item.replyId}]${props.username || props.anonymous || ""} 回复 ${item.replyId}[/pid]` : topicCode(item.topicId, item.title)
  return [
    {label: '官方地址', command: {type: '官方地址', params: {copy: url}}},
    {label: '论坛代码', command: {type: '论坛代码', params: {copy: code}}},
  ]
}

const moreMenu = (item: ReplyInfo): MenuItem[] => {
  const tid = item.topicId
  const pid = item.replyId

  const hint = item.status?.includes(ReplyStatus.NO_HINT) ?
      {label: '开启提醒', command: {type: '开启提醒', params: {tid, pid}}} :
      {label: '关闭提醒', command: {type: '关闭提醒', params: {tid, pid}}}
  return [
    {label: '回复(新)', command: {type: '回复(新)', params: {action: 'reply', tid, pid}}},
    {label: '引用(新)', command: {type: '引用(新)', params: {action: 'quote', tid, pid}}},
    {label: '评论(新)', command: {type: '评论(新)', params: {action: 'reply', tid, pid, comment: 1}}},
    {label: '编辑', command: {type: '编辑', params: {action: 'modify', tid, pid}}},
    {label: '收藏', command: {type: '收藏', params: {tid, pid}}},
    hint,
    {label: '举报', command: {type: '举报', params: {tid, pid}}},
    {label: '道具', command: {type: '道具', params: {tid, pid}}},
    {label: '源码', command: {type: '源码', params: {code: item.content}}},
  ]
}

const dropdownCommand = (command: Command) => {
  console.log(command.type, command.params)
  switch (command.type) {
    case '只看': {
      router.push({name: ReplyListRoute.LIST, params: {tid: command.params.tid}, query: {authorId: command.params.userId, page: 'e'}})
      break
    }
    case '只看(匿名)': {
      router.push({name: ReplyListRoute.ANONYMOUS, params: command.params})
      break;
    }
    case '回复':
    case '引用':
    case '评论': {
      emit('quickPost', command.params)
      break
    }
    case '编辑':
    case '回复(新)':
    case '引用(新)':
    case '评论(新)': {
      router.push({
        name: PostRouteName, params: {action: command.params.action}, query: {
          tid: command.params.tid,
          pid: command.params.pid,
          comment: command.params.comment
        }
      })
      break
    }
    case '收藏': {
      emit('addFavor', command.params)
      break
    }
    case '用户主题':
    case '用户回复':
    case '本版主题':
    case '本版精华':
    case '本版回复': {
      router.push({
        name: command.params.name,
        params: {userId: command.params.params.userId},
        query: {
          fid: command.params.params.fid,
          recommend: command.params.params.recommend
        }
      })
      break
    }
    case '官方地址':
    case '论坛代码': {
      copyText(command.params.copy, command.type)
      break
    }
    case '关闭提醒': {
      noticeStore.enable(false, command.params.tid, command.params.pid).then(res => {
        ElMessage.success(res)
      }).catch(r => {
        console.error(r)
        if (r.error) {
          ElMessage.error(r.error[0])
        }
      })
      break
    }
    case '开启提醒': {
      noticeStore.enable(true, command.params.tid, command.params.pid).then(res => {
        ElMessage.success(res)
      }).catch(r => {
        console.error(r)
        if (r.error) {
          ElMessage.error(r.error[0])
        }
      })
      break
    }
    case '举报': {
      // 弹窗要求输入举报理由，预设理由： 挖坟，引战，广告，造谣，人身攻击
      ElMessageBox.prompt("请输入举报理由", "举报").then(({value}) => {
        topicReadStore.report(command.params.tid, command.params.pid, value).then(res => {
          ElMessage.success(res)
        }).catch(r => {
          console.error(r)
          if (r.error) {
            ElMessage.error(r.error[0])
          }
        })
      })
      break
    }
    case '源码': {
      emit('source', command.params)
      break
    }
    case '道具': {
      emit('useItem', command.params)
      break
    }
    default:
      todo(command.type)
  }


}


</script>

<template>
  <el-tag-dropdown :command="dropdownCommand" :items="quickPostMenu(props.reply)">
    <el-icon class="clickable">
      <ChatSquare/>
    </el-icon>
  </el-tag-dropdown>
  <!-- 只看，查询用户发言-->
  <el-tag-dropdown :command="dropdownCommand" :items="userMenu(props.reply)">
    <el-icon class="clickable">
      <UserFilled/>
    </el-icon>
  </el-tag-dropdown>
  <!--   分享：官方地址，论坛代码-->
  <el-tag-dropdown :command="dropdownCommand" :items="shareMenu(props.reply)">
    <el-icon class="clickable">
      <Share/>
    </el-icon>
  </el-tag-dropdown>
  <!--   更多：新窗口回复，编辑，关闭提醒，举报，道具，源码-->
  <el-tag-dropdown :command="dropdownCommand" :items="moreMenu(props.reply)">
    <el-icon class="clickable">
      <MoreFilled/>
    </el-icon>
  </el-tag-dropdown>
</template>

<style scoped>

</style>